<template>
	<view class="content">
		<view class="main">
			<view class="background-ys">
				<image src="../../static/xmg.png" mode="aspectFit" />
				<view class="text-title">小 马 哥</view>
				<view class="text-title2">Xiao Ma Ge</view>
				<view class="text-body">速 运 同 城 </view>
			</view>
			<view class="body">
				<view class="row">
					<view class="cell-title">取件地址 :</view>
					<view class="cell" @click="clickSending(1)">
						<view class="text" v-if="!form.sendAddr">去哪里取件?</view>
						<view class="text2" v-else>
							<view class="text2-ms">{{form.sendAddr}}</view>
						</view>
					</view>
				</view>
				<view class="row">
					<view class="cell-title">送件地址 :</view>
					<view class="cell" @click="clickSending(0)">
						<view class="text" v-if="!form.reveiveAddr">快件送到哪里? </view>
						<view class="text2" v-else>
							<view class="text2-ms">{{form.reveiveAddr}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="body1" @click="clickGoods">
				<view class="" style="display: flex;align-items: center;width: 200rpx;">
					<view class="text1">*</view>
					<view class="text2">货物名称</view>
				</view>
				<view class="text3" style="flex: 1;" v-if="!selects_arr.length">必填,请输入货物名称 </view>
				<view class="text3" style="flex: 1;" v-else>
					{{str_item_name}}
				</view>
			</view>
			<view class="place_order" @click.stop="subMit">提交订单</view>
		</view>
		<uni-popup ref="popupGoods" class="popup" type="bottom" border-radius="10px 10px 0 0">
			<view class="poupGoods">
				<view class="head">
					<view class="head-title" @click="clickClose">取消</view>
					<view class='head-title' @click="clickDetermine">确定</view>
				</view>
				<view class="cell">
					<uni-forms ref="baseForm" :rules="customRules" label-width="90" :modelValue="baseFormData">
						<!-- <view class="goods_details">
							<view class="title"> 物品类别 <text class="required">必填</text> </view>
							<uni-forms-item class="m-b-0" label="物品类别">
								<uni-data-checkbox v-model="baseFormData.category" :localdata="categoryData"
									@change="" />
							</uni-forms-item>
						</view> -->
						<view class="goods_details">
							<view class="title"> 物品类型 <text class="required">必填</text> </view>
							<view class="good_item">
								<!-- <uni-forms-item class="m-b-0" label="物品类别"> -->
								<view v-for="(item,index) in materialList" :key="item.id"
									@click="clickItemType(item,index)"
									:class="itemActive == index?'head2-titleyx':'head2-title'">
									{{item.name }}
								</view>
								<!-- </uni-forms-item> -->
							</view>
						</view>
						
						<view class="goods_details">
							<view class="title"> 运输线路 <text class="required">必填</text></view>
							<uni-forms-item label="" name="lineId">
								<uni-data-select v-model="baseFormData.lineId" :localdata="lineData"
									@change="changeLine" />
							</uni-forms-item>
						
						</view>
						
						<view class="goods_details">
							<view style="display: flex;justify-content: space-between;">
								<view class="title">货物明细 <text class="required">必填</text></view>
								<view>
									<tui-tag class="tag" type="light-green" shape="circle" @click="add">添加物品</tui-tag>
								</view>
							</view>
							
							<!-- 其他 -->
							<!-- <view class="goods_details-body" > -->
						<!-- 	<uni-forms-item v-if="flag" label="" name="goodsInformation" style="display: flex;">
								<view class="flex">
									<uni-easyinput type="number" v-model="baseFormData.goodsInformation"
										placeholder="请输入物件名称" @input="changeValue"/>
									<uni-number-box :min="1" v-model="baseFormData.numberValue" @change="changeElse" />
								</view>
							</uni-forms-item> -->
							<!-- </view> -->
							<uni-forms-item v-if='!flag' label="" name="goodValue">
								<view class="flex"  :key="index">
									<uni-data-select style="width: 80%;" v-model="selects_item.id"
										:localdata="freightList" @change="change" />
									<uni-number-box  :min='1'
										v-model="selects_item.num" @change="changeValue" />
								</view>
								
								 
								<view class="flex" style="margin-top: 10rpx;" v-for="(item,index) in selects_arr_tem" :key="item.index">
									<!-- <uni-easyinput style="width: 80%;" :value="item.text" :disabled="true"
										 @clear='changeclear(item,index)'/> -->
										 <view class="" style="width: 80%;border: 1rpx solid #eee;height: 72rpx;padding: 0 20rpx;box-sizing: border-box;display: flex;align-items: center;background-color: #eee;border-radius: 12rpx;position: relative;">
										 	{{item.text}}
											<view class="" style="position: absolute;width: 25rpx;height: 25rpx;right: 20rpx;top: 50%;margin-top: -12rpx;" @click="item_del(item,index)">
												<image src="/static/images/close_icon.png" mode="" style="width: 100%;height: 100%;"></image>
											</view>
										 </view>
									<uni-number-box  :min='1'
										v-model="item.num" @change="changeValue" />
								</view>
								
								<!-- <view class="flex" v-for="(item,index) in selects" :key="item.id">
									<uni-data-select style="width: 80%;" v-model="baseFormData.goodValue"
										:localdata="freightList" @change="change" />
									<uni-number-box :disabled="!baseFormData.goodValue" :min='1'
										v-model="baseFormData.numberValue" @change="changeValue" />
								</view> -->
							</uni-forms-item>
							<uni-forms-item v-if="baseFormData.category == 1" label-width='50' label="总货重" :max='10'
								name="cargoWeight">
								<uni-easyinput type="number" v-model="baseFormData.cargoWeight" @input="changeValue"
									placeholder="超过10千克,续重每公斤增加1元" />
							</uni-forms-item>
							<uni-forms-item v-if="baseFormData.category == 2" label-width='50' label="长*宽*高(cm)"
								:name="'volumeHeight'&&'volumeLength'&&'volumeHeight'">
								<view style="display: flex;align-items: center;">
									<uni-easyinput :clearSize='16' type="number" v-model="baseFormData.volumeLength"
										placeholder="长" />
									*
									<uni-easyinput :clearSize='16' type="number" v-model="baseFormData.volumeWidth"
										placeholder="宽" />
									*
									<uni-easyinput :clearSize='16' type="number" @input="changeValue"
										v-model="baseFormData.volumeHeight" placeholder="高" />
								</view>
							</uni-forms-item>
							<view class="m-t-10"> 总计：{{allMoney||0}} </view>
						</view>
						
						<view class="goods_details">
							<view class="title">备注信息</view>
							<view class="remark">
								<uni-easyinput type="textarea" autoHeight v-model="form.remark"
									placeholder="请输入给快递员的捎话内容" />
								<view class="upload">
									<canvas v-if="waterMarkParams.display" canvas-id="waterMarkCanvas"
										:style="canvasStyle" @click="preViewImage" />
									<tui-upload :value="addFileList" :width="192" :height="192" @complete="result"
										@remove="remove" />
								</view>
							</view>
						</view>
					</uni-forms>
				</view>
			</view>
		</uni-popup>
		
		<!-- <uni-popup ref="popupCoupon" class="popup" type="center" :mask-click="false" :close-button="true" border-radius="10px 10px 0 0">
			
			<view style="width: 500rpx;">
				<view>
					<image style="width: 100%;" src="/static/yhq.jpg" mode=""></image>
				</view>
				<view class="couponBtn" @click="createCoupons">
					点击此处领取4.99元优惠券
				</view>
			</view>
			
		</uni-popup> -->
		<!-- 
		<uni-popup ref="alertDialog" type="dialog" style="zindex: 10000">
			<uni-popup-dialog cancelText="取消" title="获取抽取优惠券通知" confirmText="确定"
			 :content="`恭喜您获取`+drowsNum+`次抽取优惠券机会是否立即前往抽取!`" @confirm="dialogConfirm"
				@close="dialogClose" />
		</uni-popup> -->
	</view>
</template>

<script>
	import $store from '@/store/index'
	import {
		calCulatePrice,
		addOrder,
		cargoTypeList,
		cargoTemplateList,
		lineList,
		countOrderPrice
	} from '@/api/index'
	import {
		ifFirstOrder,
		ifFirstLogin,
		createCoupon,
		userDrowsNum
	} from '@/api/user'
	
	import {
		baseUrl
	} from '@/util/config'
	import {
		onLoad,
		onShareAppMessage,
		onShareTimeline
	} from '@dcloudio/uni-app'
	export default {
		components() {},
		data() {
			return {
				baseFormData: {
					category: 0,
					numberValue: 1,
					goodValue: [],
					goodsInformation: "",
					cargoWeight: null,
					volumeLength: null,
					volumeWidth: null,
					volumeHeight: null,
					lineId: ''
				},
				str_item_name:'',
				customRules: {
					category: {
						rules: [{
							required: true,
							errorMessage: '类型不能为空'
						}]
					},
					numberValue: {
						rules: [{
							required: true,
							errorMessage: '数值不能为空'
						}]
					},
					// goodValue: {
					// 	rules: [{
					// 		required: true,
					// 		errorMessage: '货物不能为空'
					// 	}]
					// },
					cargoWeight: {
						rules: [{
							required: true,
							errorMessage: '货重不能为空'
						}]
					},
					volumeWidth: {
						rules: [{
							required: true,
							errorMessage: '宽不能为空'
						}]
					},
					volumeLength: {
						rules: [{
							required: true,
							errorMessage: '长度不能为空'
						}]
					},
					volumeHeight: {
						rules: [{
							required: true,
							errorMessage: '高不能为空'
						}]
					},
					lineId: {
						rules: [{
							required: true,
							errorMessage: '线路不能为空'
						}]
					},
					goodsInformation: {
						rules: [{
							required: true,
							errorMessage: '物件名称不能为空'
						}]
					},
				},
				categoryData: [{
					text: '件',
					value: 0
				}, {
					text: '公斤',
					value: 1
				}, {
					text: '体积',
					value: 2
				}],
				longitude: 114.010857,
				latitude: 22.63137,
				serverUrl: '/oss/upload',
				imgFileArr: [],
				waterMarkParams: {
					display: false, // 控制 canvas 创建与销毁
					canvasWidth: 300, // 默认宽度
					canvasHeight: 225, // 默认高度
					contentHeight: 150, // 将要被绘制到图像中的矩形的高度(px)
				},
				form: {
					reveiveAddr: '',
					sendAddr: '',
					remark: '',
					receiveLatitude: 0,
					receiveLongitude: 0,
					sendLongitude: 0,
					sendLatitude: 0,
					reveiveCity: '',
					sendCity: ''
				},

				number: 0,
				packingActive: -1,
				formObject: {},
				mapContext: '',
				goodsInformationArray: [],
				active: -1,
				itemActive: -1,
				materialList: [],
				freightList: [],
				addFileList: [],
				file: '',
				delFileList: [], // 删除的文件列表
				imageStyles: {
					width: 100,
					height: 100,
					border: {}
				},
				goodList: 1,
				allMoney: 0,
				value: [],
				address: '山东产业技术研究院高科技创新园',
				lineData: [],
				showLine: false,
				lineId: '',
				cargoTemplateId: null,
				drowsNum:0,
				selects_arr:[],
				selects_arr_tem:[],
				selects_item:{
					id:'',
					num:1,
					cargoTypeId:'',
					text:'',
					lineId:''
				},
				
			}
		},
		onLoad() {
			// 清空缓存
			uni.removeStorageSync('form');
			uni.removeStorageSync('formReceipt');
			
		},
		onShow() {
			// this.$refs.popupGoods.open('bottom')
			var s = this;
			//取件地址缓存对象
			let formObject = uni.getStorageSync('form');
			console.log(formObject)
			//收件地址缓存对象
			let formReceipt = uni.getStorageSync('formReceipt');
			//封装总form后台提交
			// this.form = formObject
			this.form.sendUser = formObject.sendUser
			this.form.sendPhone = formObject.sendPhone
			this.form.sendAddr = formObject.detailAddress
			this.form.sendCity = formObject.city
			this.form.sendLatitude = formObject.latitude
			this.form.sendLongitude = formObject.longitude
			this.form.reveiveUser = formReceipt.reveiveUser
			this.form.receivePhone = formReceipt.receivePhone
			this.form.reveiveAddr = formReceipt.province + formReceipt.detailAddress
			this.form.reveiveCity = formReceipt.city
			this.form.receiveLongitude = formReceipt.longitude
			this.form.receiveLatitude = formReceipt.latitude
			this.form.status = 0
			console.log("总form========", this.form)
			let token = uni.getStorageSync('X-Access-Token') ? true : false
			if (token) {
				
				// if(!uni.getStorageSync('is_lq') && uni.getStorageSync('isfirstlogin')){
				// 	this.$refs.popupCoupon.open('center')
				// }
				
				// userDrowsNum({openId:uni.getStorageSync('user').userId}, 'get')
				// .then((res) => {
				// 	if(res > 0){
				// 		if(uni.getStorageSync("lotclose") !== false){
				// 			this.drowsNum = res
				// 			this.$refs.alertDialog.open('center')
				// 		}
				// 	}
				// })
			}
			
			
			let cargo = uni.getStorageSync('cargo');
			let order = uni.getStorageSync('order');
			if(cargo){
				setTimeout(function(){
					s.$refs.popupGoods.open('bottom')
					s.active = -1
					s.getCargoTypeList();
					setTimeout(function(){
						for(var indexs in s.materialList){
							if(s.materialList[indexs].id == cargo.cargoTypeId){
								s.clickItemType(s.materialList[indexs],indexs);
							}
						}
						
						setTimeout(function(){
							for(var indexss in s.freightList){
								if(s.freightList[indexss].cargoTemplateId == cargo.cargoTemplateId){
									s.change(cargo.cargoTemplateId);
									s.baseFormData.goodValue = cargo.cargoTemplateId;
								}
							}
						},1000)
						
						s.baseFormData.lineId = order.lineId;
						s.baseFormData.numberValue = cargo.num
						this.from.remark = order.remark
						console.log(s.baseFormData)
						
					},1000)
					
				},200)
				
				uni.removeStorageSync('cargo')
				uni.removeStorageSync('order')
				uni.removeStorageSync('form')
				uni.removeStorageSync('formReceipt')
				
			}
			
			
		},
		mounted() {
			
			// if(!uni.getStorageSync('adressNow')){
			// 	this.getLocation()
			// }
			// this.getLocation()
		},
		computed: {
			canvasStyle() {
				return {
					position: 'fixed', // 移除到屏幕外
					left: '999px',
					width: this.waterMarkParams.canvasWidth + 'px',
					height: this.waterMarkParams.canvasHeight + 'px',
				}
			},
			
		},
		methods: {
			add(){
				if(!this.selects_item.id){
					uni.showToast({
						title: "请添加货物明细",
						icon: "none"
						
					})
					return
				}
				var s = this.selects_item
				console.log(1)
				// console.log(s)
				// console.log(this.selects_item)
				this.selects_arr_tem.push(s)
				// this.selects_arr.push(s)
				this.selects_item = {
					id:'',
					num:1,
					cargoTypeId:'',
					text:'',
					lineId:''
					}
				console.log(2)	
				// this.show_itemName()
				this.changeValue()
				// console.log(this.selects_arr,'添加之后')
				// this.selects_arr = s;
			},
			dialogClose(){
				uni.setStorageSync('lotclose', false);
			},
			dialogConfirm(){
				this.$refs.alertDialog.close();
				uni.setStorageSync('lotclose', false);
				uni.$tui.href('/pages/myPage/lottery');
			},
			createCoupons(){
				// createCoupon({openId:uni.getStorageSync('user').userId,amount:'4.99'}, 'get')
				// .then((res) => {
				// 	if(res){
				// 		uni.setStorageSync('is_lq', true);
				// 		this.$refs.popupCoupon.close();
				// 		uni.showToast({
				// 			title: '已领取优惠券4.99元，马上下单立减优惠~',
				// 			icon: 'none'
				// 		});
				// 	}
				// })
			},
			getLocation() {
				let that = this
				console.log('看看走了没有')
				uni.getLocation({
					type: 'gcj02', // 使用国测局坐标系
					isHighAccuracy: true,
					success: function(res) {
						that.longitude = res.longitude
						that.latitude = res.latitude
						uni.request({
							url: `https://apis.map.qq.com/ws/geocoder/v1`,
							method: 'POST',
							data: {
								coord_type: 5,
								get_poi: 0,
								output: 'json',
								key: 'W4WBZ-TUD65-IDAIR-QPM36-HMFQ5-CGBZP',
								location: `${res.latitude},${ res.longitude}`
							},
							success(res) {
								uni.setStorageSync('adressNow', res.data.result.address);
								uni.setStorageSync('locationNow', res.data.result.location);
								console.log('获取位置信息成功: ' + err.errMsg);
			
							},
							fail: (err) => {
								console.log(err);
								uni.hideLoading();
							},
						})
					},
					fail: function(err) {
						console.log('获取位置信息失败: ' + err.errMsg);
					}
				});
			},
			// 查询货物名称
			getCargoTypeList() {
				cargoTypeList({}, 'get')
					.then((res) => {
						this.materialList = res.rows
						this.itemActive = 0
						this.clickItemType(res.rows[0], 0)

					})
				lineList({}, 'get')
					.then((res) => {
						res.rows.forEach(item => {
							item.text = item.name
							item.value = item.id
						})
						this.lineData = res.rows
					})
			},
			change(value,index) {
				console.log('value改变了',value,index)
				const that = this
				console.log('1')
				console.log(that.selects_item)
				console.log(that.selects_arr)
				that.selects_item.id = value
				this.freightList.forEach(res=>{

					if(res.cargoTemplateId == value){
						that.selects_item.text = res.text
						that.selects_item.cargoTypeId = res.cargoTypeId
					}
				})
				console.log('2')
				// console.log(that.selects_arr,"2")
				console.log( that.selects_item)
				
				// this.selects_item.text = 
				// let value = []
				// for(let a = 0; a < this.selects.length ; a++){
					
				// }
				// if(value == ''){
				// 	console.log(1)
				// 	var newselects = [];
				// 	this.selects.forEach(item => {
				// 		console.log(item)
				// 		if(item.id){
				// 			newselects.push(item)
				// 		}
				// 	});
				// 	console.log(this.selects)
				// 	this.selects = newselects;
					
					
				// }else{
				// 	console.log(2)
				// 	let arr = []
				// 	this.freightList.forEach(item => item.cargoTemplateId == value ? arr.push(item) : '');
				// 	this.baseFormData.goodsInformation = arr[0].name
				// 	this.goodsInformationArray = arr
				// 	this.cargoTemplateId = value
					this.changeValue()	
				// }
				
				//多选
					// console.log(1)
					// var newselects = [];
					// this.selects.forEach(item => {
					// 	console.log(item)
					// 	// if(){
					// 		newselects.push(item)
					// 	// }
					// });
					// this.selects[index].cargoTypeId = this.actItemTypeId,
					// this.selects[index].id = value
					// console.log(this.selects)
					// this.selects = newselects;
					

			},
			//删除物品
			changeclear(item,index){
				console.log(index)
			},
			item_del(item,index){
				this.selects_arr_tem.splice(index,1)
				this.changeValue()
			},
			
			
			hide() {},

			changeElse(el) {
				this.changeValue(el)
			},
			changeLine(e) {
				this.showLine = false
				this.lineId = e.text
				this.lineId = e.value
				this.changeValue();
			},

			changeValue(value) {
				console.log(value)
				// console.log(this.selects_arr)
				const that = this
				
				let arr = []
				that.selects_arr_tem.forEach(res=>{
					arr.push(res)
				})
				if(that.selects_item.id){
					arr.push(that.selects_item)
				}
				// console.log('查询数组')
				// console.log(arr)
				// return
				// if (this.baseFormData.volumeLength * this.baseFormData.volumeWidth * this.baseFormData.volumeHeight >
				// 	42000) {
				// 	this.allMoney = 0
				// 	uni.showToast({
				// 		title: '体积不得大于42000cm³',
				// 		icon: 'none'
				// 	});
				// 	return
				// }
				setTimeout(() => {
					let params = [],params_obj = {}
					if(arr.length == 0){
						this.allMoney = 0
						return
					}
					arr.forEach(res=>{
						params_obj.normsType = this.baseFormData.category + 1
						params_obj.num = res.num
						params_obj.templateId = res.id
						params_obj.lineId = that.baseFormData.lineId
						if (that.baseFormData.category == 1) {
							params_obj.weight = that.baseFormData.cargoWeight
							
						}
						if (that.baseFormData.category == 2) {
							params_obj.volumeLength = that.baseFormData.volumeLength
							params_obj.volumeWidth = that.baseFormData.volumeWidth
							params_obj.volumeHeight = that.baseFormData.volumeHeight
						}
						params.push(params_obj)
						params_obj = {}
						console.log(params)
					})
					
					// return
					// let params = {
					// 	normsType: this.baseFormData.category + 1, //种类
					// 	num: this.baseFormData.numberValue,       //物品数量
					// 	templateId: this.cargoTemplateId,         //货物id
					// 	lineId: this.baseFormData?.lineId         //线路id
					// }
					
					
					// if(params.normsType==null || params.normsType==''){
					// 	return
					// }
					// if(params.num==null || params.num==''){
					// 	return
					// }
					// if(params.templateId==null || params.templateId==''){
					// 	return
					// }
					// if(params.lineId==null || params.lineId==''){
					// 	return
					// }
					countOrderPrice(params, 'post')
						.then((res) => {
							
							this.allMoney = res.data
						})
				}, 100)
			},

			clickGoods() {
				let token = uni.getStorageSync('X-Access-Token') ? true : false
				if (!token) {
					uni.navigateTo({
						url: '/pages/index/index',
					})
				} else {
					this.active = -1
					this.$refs.popupGoods.open('bottom')
					this.getCargoTypeList();
				}
			},
			clickClose() {
				this.active = 1
				this.$refs.popupGoods.close();
			},
			clickDetermine() {
				uni.showLoading()
				let arr = [],text = []
				if(this.selects_item.id){
					arr.push(this.selects_item)
				}
				if(this.selects_arr_tem.length){
					this.selects_arr_tem.forEach(res=>{
						arr.push(res)
					})
				}
				if(!arr.length){
					uni.showToast({
						title: '请选择货物明细',
						icon: "none"
					})
					return
				}
				arr.forEach(res=>{
					text.push(res.text)
				})
				this.selects_arr = arr
				this.str_item_name = text.join("/")
				
				this.$refs.baseForm.validate().then(res => {
					uni.hideLoading()
					this.$refs.popupGoods.close();
					console.log('表单数据信息：', res);
				}).catch(err => {
					uni.hideLoading()
					console.log('表单错误信息：', err);
				})
			},
			clickSending(type) {
				if(!uni.getStorageSync('adressNow')){
					this.getLocation()
				}
				let token = uni.getStorageSync('X-Access-Token') ? true : false
				if (!token) {
					uni.navigateTo({
						url: '/pages/index/index',
					})
				} else {
					if (type) {
						uni.navigateTo({
							url: "/pages/sendingPage/sendingPage"
						})

					} else {
						uni.navigateTo({
							url: "/pages/collectPage/collectPage"
						})
					}
				}
			},
			// 查询货物明细
			clickItemType(item, index) {
				this.cargoTemplateId = item.cargoTemplateId ? item.cargoTemplateId : ''
				// this.allMoney = 0
				this.baseFormData.goodValue = ''
				this.baseFormData.goodsInformation = ''
				this.baseFormData.numberValue = 1
				this.itemActive = index;
				this.actItemTypeId = item.id
				if (item.code == 'QT') {
					this.flag = true
					this.goodsInformationArray = [{
						"cargoTemplateId": "",
						"cargoTemplateName": item.name,
						"cargoTypeId": item.id,
						"cargoTypeName": item.name,
						"createBy": "",
						"createTime": "",
						"fee": 5,
						"id": "",
						"isDeleted": 0,
						"name": "",
						"num": 0,
						"orderId": "",
						"params": {},
						"remark": "",
						"updateBy": "",
						"updateTime": "",
						"volume": 0,
						"weight": 0
					}]

				} else {
					this.flag = false
					cargoTemplateList({
							cargoTypeId: item.id
						}, 'get')
						.then((res) => {
							for (var i = 0; i < res.rows.length; i++) {
								res.rows[i].cargoTemplateId = res.rows[i].id
								res.rows[i].fee = 0
								res.rows[i].id = ''
								res.rows[i].num = 1
								res.rows[i].checked = false
								res.rows[i].text = res.rows[i].name
								res.rows[i].value = res.rows[i].cargoTemplateId
							}
							this.freightList = res.rows
						})
				}
			},
			clickPacking(e) {
				var arr = [];
				var items = this.freightList;
				var len = this.freightList.length;
				var values = e.detail.value;
				this.cargoTemplateId = values
				for (var i = 0; i < len; i++) {
					var item = items[i];
					if (values.indexOf(item.cargoTemplateId) > -1) { //则包含该元素}) 
						this.$set(item, 'checked', true);
					} else {
						this.$set(item, 'checked', false);
						this.$set(item, 'num', 1);
					}
				}
				// 判断选中状态
				this.freightList.forEach(item => item.checked == true ? arr.push(item) : '');
				this.baseFormData.goodsInformation = arr[0].name
				this.goodsInformationArray = arr
				this.changeValue(item.num)
			},
			async subMit() {
				if (!this.form.sendAddr) {
					uni.showToast({
						title: '请检查寄件地址',
						icon: 'none'
					});
				} else if (!this.form.reveiveAddr) {
					uni.showToast({
						title: '请检查收件地址',
						icon: 'none'
					});
				} else if (!this.selects_arr.length) {
					uni.showToast({
						title: '请填写货物名称',
						icon: 'none'
					});
				} else {
					const ls = []
					this.addFileList.forEach(item => {
						ls.push({
							url: item
						})
					})
					//if (this.flag)
					const that = this
				    // this.goodsInformationArray[0].num =  this.baseFormData.numberValue//this.goodList
					this.selects_arr.forEach(res=>{
						res.name = res.text
						res.cargoTemplateId = res.id
						delete res.id
					})
					
					let params = {
						lineId: this.baseFormData.lineId,
						amount: this.allMoney,
						// weight: this.cargoWeight,
						orderCargoList: this.selects_arr,
						receiveAddr: this.form.reveiveAddr,
						reveiveCity: this.form.reveiveCity,
						receiveLatitude: this.form.receiveLatitude,
						receiveLongitude: this.form.receiveLongitude,
						receivePhone: this.form.receivePhone,
						reveiveUser: this.form.reveiveUser,
						sendLatitude: this.form.sendLatitude,
						sendAddr: this.form.sendAddr,
						sendCity: this.form.sendCity,
						sendLongitude: this.form.sendLongitude,
						sendPhone: this.form.sendPhone,
						sendUser: this.form.sendUser,
						remark: this.form.remark,
						photoList: ls,
						wechatUserId: uni.getStorageSync('user').userId||uni.getStorageSync('user').id
					}
					console.log(params);
					// return	
					addOrder(params, 'post')
						.then((res) => {
							if (res.code == 200) {
								uni.showToast({
									title: '订单提交成功',
									duration: 2000
								});
								$store('app').usePayCashier({
									payCode: res.orderId,
									orderSource: 2,
									payAmount: this.allMoney,
									// orderParams: `appId=${res.data.appId}`,
									backUrlKey: '/pages/orderList/orderList'
								})

							} else {
								uni.showToast({
									title: res.msg,
									icon: 'none'
								});
							}
						})
				}

			},
			preViewImage() {
				uni.previewImage({
					urls: this.addFileList,
					current: this.addFileList[0]
				})
			},
			result(e) {
				this.file = e.imgArr[e.imgArr.length - 1]
				setTimeout(() => {
					this.imageData = e.imgArr;
					this.callAddWaterMark([this.file])
				}, 500)

			},
			remove(e) {
				let index = e.index
				this.addFileList.splice(index, 1);
			},
			// 因为有可能在相册中选择多个图片，所以这里要依次生成水印
			async callAddWaterMark(imgPathArr) {
				let results = []
				if (imgPathArr.length > 0) {
					let addIndex = 0
					while (addIndex < imgPathArr.length) {
						const tempFilePath = await this.addWaterMark(imgPathArr[addIndex])
						results.push(tempFilePath)
						addIndex = addIndex + 1
					}
				}
			},
			// 添加水印
			addWaterMark(src) {
				return new Promise((resolve, reject) => {
					// 获取图片信息，配置 canvas 尺寸
					uni.getImageInfo({
						src,
						success: res => {
							// 修复部分手机(如红米9)手机屏幕比较窄拍摄出来的图片水印压缩着覆盖的问题
							this.waterMarkParams.canvasWidth = res.width
							this.waterMarkParams.canvasHeight = res.height;
							this.waterMarkParams.display = true
							// console.log('当前图片信息waterMarkParams：', this.waterMarkParams);
							// 等待 canvas 元素创建
							let context = uni.createCanvasContext("waterMarkCanvas", this);
							/* 绘制 */
							const {
								canvasWidth,
								canvasHeight,
								contentHeight
							} = this.waterMarkParams
							context.drawImage(src, 0, 0);
							context.beginPath();
							// 绘制底部的白色背景
							context.fill();
							// 设置文字的透明度
							context.setGlobalAlpha(1);
							// 3.绘制底部的文字
							context.setFontSize(18);
							context.setFillStyle("#ccff01");
							// context.setFillStyle("#000");
							context.fillText(`型号：${uni.getSystemInfoSync().model}`, 10, canvasHeight -
								65);
							context.fillText(`地址：${ uni.getStorageSync('adressNow')}`, 10,
								canvasHeight - 45);
							context.fillText(`经纬度：${this.longitude},${this.latitude}`, 10,
								canvasHeight - 25);
							// item.createTime = uni.$tui.dates(item.createTime )
							context.fillText(`拍摄时间：${ uni.$tui.dates(new Date())}`, 10, canvasHeight -
								5);
							// 本次绘画完重开开始绘画，并且在绘画完毕之后再保存图片，不然页面可能会出现白屏等情况
							context.draw(false, () => {
								uni.showLoading({
									title: '开始绘画'
								})
								setTimeout(() => {
									// console.log('!!!!!开始绘画', canvasWidth,
									// 	canvasHeight);
									uni.canvasToTempFilePath({
										canvasId: "waterMarkCanvas",
										success: (res) => {
											this.file = res.tempFilePath
											this.waterMarkParams.display =
												false
											this.uploadFile()
											uni.hideLoading();
											resolve(res.tempFilePath)
										},
										fail: err => {
											uni.hideLoading();
											reject(err)
											console.log(err);
										}
									}, this)
								}, 1000);
							})
						}
					})
				})
			},
			uploadFile() {
				uni.showLoading({
					title: '上传中'
				});
				const formData = {
					folder: 'order'
				}
				uni.uploadFile({
					url: baseUrl + '/oss/upload', // 接口地址
					header: {
						'Authorization': uni.getStorageSync('X-Access-Token'),
						'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
						'Content-Disposition': 'form-data'
					},
					filePath: this.file, // 文件路径（可选）
					name: 'file', // 后台服务器接收文件的字段名
					formData: formData, // 传递的额外数据
					success: (res) => {
						uni.hideLoading();
						uni.showToast({
							title: '上传成功',
							duration: 1000,
							icon: 'none'
						});
						let data = JSON.parse(res.data)
						this.$nextTick(() => {
							this.addFileList.push(data.url)
						})
					},
					fail: (err) => {
						uni.hideLoading();
						uni.showToast({
							title: '上传失败,请重试',
							duration: 1000,
							icon: 'none'
						});
						// console.error(err,"上传失败");
					},
				});
			},
		},
		onShareAppMessage(res) {
			const openId = uni.getStorageSync('user').openid;
			console.log(openId);
			return {
				title: '小马哥速运同城',
				path: `/pages/index/index?openId=${openId}`,
				imageUrl: '@/static/xmg.png', // 分享图
				// desc: '小程序描述描述描述描述'
			}
		},
		// 分享朋友圈
		onShareTimeline() {
			return {
				title: '小马哥速运同城',
				imageUrl: '@/static/xmg.png', // 分享图
				query: `openId=${openId }`
			}
		},
	}
</script>

<style lang="scss" scoped>
	.couponBtn{
		color:#fff;
		background: #ee451e;
		padding: 20rpx;
		// border-radius: 10rpx;
		text-align: center;
		
	}
	.content {
		background: rgb(250, 250, 250);
		position: relative;
	}

	.background-ys {
		padding-top: 10rpx;
		width: 100%;
		height: 750rpx;
		text-align: center;
		background: rgb(204, 255, 1);

		image {
			width: 200rpx;
			height: 200rpx;
			margin-top: 50rpx;
		}

		.text-title {
			font-size: 80rpx;
			font-weight: bold;
			color: rgb(215, 94, 81);
			font-family: sans-serif;
		}

		.text-title2 {
			font-size: 50rpx;
			font-weight: bold;
			color: rgb(84, 109, 165);
		}

		.text-body {
			font-size: 86rpx;
			padding-top: 10rpx;
			color: rgb(208, 92, 79);
		}
	}

	.body {
		margin: 5px;
		background: white;
		margin-top: -100px;
		border-radius: 30rpx;
		box-shadow: 5px 5px 10px rgb(227, 242, 204);
		border: 1rpx solid #eee;

		.row {
			display: flex;
			margin: 25rpx 20rpx;
			align-items: center;

			.cell-title {
				margin-right: 10px;
			}

			.cell {
				flex: 1;
				padding: 10px;
				background: rgb(246, 246, 246);
				border-radius: 20rpx;
				display: flex;
				align-items: center;
				width: 30%;

				.text2 {
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: space-around;

					.text2-ms {
						color: rgb(0, 0, 0);
						width: 400rpx;
						overflow: auto;
					}

				}

				.text {
					margin: 50rpx 20rpx;
					// border: 1rpx solid red;
					color: rgb(167, 167, 167);
					overflow: auto;

				}

			}
		}
	}

	.body1 {
		height: 100rpx;
		margin-top: 10px;
		border-radius: 30rpx;
		background: white;
		border: 1rpx solid #eee;
		box-shadow: 5px 5px 10px rgb(227, 242, 204);
		display: flex;
		align-items: center;

		.text1 {
			line-height: 110rpx;
			margin-left: 40rpx;
			color: red;
		}

		.text2 {
			line-height: 100rpx;
		}

		.text3 {
			// margin-top: 30rpx;
			// margin-left: 168rpx;
			color: rgb(167, 167, 167);
			align-items: center;
			// line-height: 100rpx;
		}
	}

	.place_order {
		height: 100rpx;
		width: 700rpx;
		position: fixed;
		bottom: 20rpx;
		left: 25rpx;
		border-radius: 30rpx;
		box-shadow: 5px 5px 10px rgb(227, 242, 204);
		background: rgb(204, 255, 1);
		text-align: center;
		line-height: 100rpx;
		font-weight: bold;
		color: rgb(254, 112, 2);
	}

	.poupGoods {
		height: calc(100vh - 300px);
		border-top-left-radius: 30rpx;
		border-top-right-radius: 30rpx;
		background: #f2f3f5;
		overflow-y: scroll;
		margin-bottom: -35px;

		.cell {
			padding: 4px 14px 14px;
		}

		.title {
			font-weight: bold;
			display: flex;
			align-items: center;
		}

		.required {
			font-size: 12px;
			padding: 4px 6px;
			background: #FEF0F0;
			border-radius: 4px;
			color: #E84234;
			margin-left: 10px;
		}

		.head {
			display: flex;
			justify-content: space-between;
			top: 0;
			height: 45px;
			align-items: center;
			position: sticky;
			background: #ffff;
			z-index: 999;

			.head-title {
				width: 150rpx;
				height: 50rpx;
				text-align: center;
				line-height: 50rpx;
				// border: 1rpx solid #eee;
			}

			.head-titleyx {
				padding: 8rpx;
				height: 50rpx;
				text-align: center;
				line-height: 50rpx;
				background: rgb(204, 255, 1);
				border: 1rpx solid #eee;
				border-radius: 10rpx;
				color: white;
				font-weight: bold;
			}

			.head-title1 {
				width: 150rpx;
				height: 50rpx;
				text-align: center;
				line-height: 50rpx;
			}
		}

		.head2 {
			background: #fff;
			border-radius: 4px;
			padding: 10px;


		}

		.remark {
			margin-top: 10px;

			// justify-content: space-between;
			.upload {
				// display: flex;
				position: relative;
				margin-top: 15px;

				.upload_file {
					width: 90px;
					height: 90px;
					border: 1px solid #ccc;
					display: flex;
					align-items: center;
					justify-content: center;
				}
			}

			#waterMarkCanvas {
				position: absolute;
				width: 160rpx;
				height: 160rpx;
				// left: 100px;
			}
		}

		.head3 {
			background: #fff;
			border-radius: 4px;
			padding: 20px 10px;

			input {
				background: rgb(238, 238, 238);
				height: 50rpx;
				text-align: center;
				line-height: 50rpx;
				width: 500rpx;
				border-radius: 5rpx;
			}
		}

		::v-deep.uni-forms-item {
			// margin-bottom: 0;
			align-items: center;
		}

		.flex {
			display: flex;
			align-items: center;
			justify-content: space-between;
		}

		.goods_details {
			background: #fff;
			border-radius: 4px;
			padding: 10px;
			margin-top: 20rpx;

			.goods_details-body {
				display: flex;
				// border-bottom: 2rpx solid rgb(238, 238, 238);
				justify-content: space-between;
				// height: 40px;
				align-items: center;
				margin-top: 10px;

				.goods_details-cloumn {
					display: flex;
					justify-content: space-around;
					align-items: center;
					margin-left: 20rpx;
					width: 200rpx;
					text-align: center;
					overflow: auto;
				}
			}

			.good_item {
				display: flex;
				flex-wrap: wrap;
			}

			.head2-title {
				margin-right: 15rpx;
				margin-top: 10rpx;
				padding: 8rpx;
				border: 1rpx solid #eee;
				background: rgb(238, 238, 238);
				border-radius: 10rpx;
				text-align: center;
			}

			.head2-titleyx {
				margin-right: 15rpx;
				margin-top: 10rpx;
				padding: 8rpx;
				border: 1rpx solid #eee;
				background: rgb(204, 255, 1);
				border-radius: 10rpx;
				text-align: center;
			}
		}

	}

	.container {
		width: 100%;
		height: 100vh;
		margin: 6.94rpx 0;
		border: 1px solid #e3e3e3;

		.coordinate {
			z-index: 9999;
			position: relative;
			top: 50%;
			left: 50%;
		}
	}

	.map_container {
		background-color: #fff;
		position: absolute;
		top: 0;
		/* 底部留出的空间 */
		left: 0;
		right: 0;
	}

	.map {
		width: 100%;
		/* 计算总的高度，减去底部空间，然后取45% */
		height: calc((100vh - 80px) * 0.45);
	}

	.map_text {
		background: #fff;
		padding: 0 15px;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	text {
		margin: 5px 0;
		display: block;
		font-size: 12px;
	}

	.h1 {
		margin: 15px 0;
		font-size: 15px;
	}

	.address-list {
		position: absolute;
		background-color: #fff;
		top: auto;
		/* 移除绝对定位 */
		bottom: auto;
		left: 0;
		right: 0;
		/* 同样计算剩余的高度，取剩下的45% */
		height: calc((100vh - 165px) * 0.7);
		overflow-y: auto;

		/* 添加滚动条 */
		.address-list-item {
			border-bottom: 1px solid #eee;
			display: flex;
			align-items: center;
			justify-content: space-between;
		}
	}

	.tip-titile {
		font-size: 28rpx;
		color: #333;
		font-weight: 400;
	}

	.tip-address {
		font-size: 20rpx;
		color: gray;
	}

	.search {
		padding: 8px 15px;
		background-color: #fff;
		border-radius: 10rpx;
		border-bottom: 1px solid #eee;

		.searchBox {
			height: 65rpx;
			background-color: #ebebeb;
			padding: 10rpx 0;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 10rpx;
		}

		.searchInput {
			height: 45rpx;
			padding: 8px 15px;
			outline: none;
			border: 1px solid #d3d3d3;
			border-radius: 5px;
			background-color: #ebebeb;
			margin-top: 10px;
		}
	}

	.thorui-align__center {
		display: flex;
		align-items: center;
	}

	.tui-text {
		font-size: 30rpx;
		padding-left: 12rpx;
	}

	::v-deep .uni-numbox__value {
		height: 36px;
	}
</style>